<template>
  <div style="position: relative;">
    <el-row>
      <el-col :span="24">
        <el-table :data="tableDate" size="mini" style="width: 100%;" header-cell-class-name="table-header-gray" v-loading="isShowloading">
          <el-table-column type="index" align="center" width="55" label="序号"></el-table-column>
          <el-table-column prop="contractName" align="center" label="合同名称" show-overflow-tooltip></el-table-column>
          <el-table-column prop="contractCode" align="center" label="合同编码" show-overflow-tooltip></el-table-column>
          <el-table-column prop="projectName" align="center" label="所属项目" show-overflow-tooltip></el-table-column>
          <el-table-column prop="businessTypeName" align="center" label="业务类型" show-overflow-tooltip></el-table-column>
          <el-table-column prop="customerName" align="center" label="单位名称" show-overflow-tooltip></el-table-column>
          <el-table-column prop="contractStatusName" align="center" label="合同状态" show-overflow-tooltip></el-table-column>
          <el-table-column prop="paymentMethodName" align="center" label="付款方式" show-overflow-tooltip></el-table-column>
          <el-table-column prop="contractAmount" align="center" label="合同金额（元）" width="120"></el-table-column>
          <el-table-column prop="backAmount" align="center" label="待回款金额（元）" width="120"></el-table-column>
          <el-table-column prop="receivedAmount" align="center" label="已回款金额（元）" width="120"></el-table-column>
          <el-table-column prop="finishDate" align="center" label="到期日期" show-overflow-tooltip></el-table-column>
          <el-table-column prop="signingDate" align="center" label="签约时间" show-overflow-tooltip></el-table-column>
          <el-table-column prop="contactPerson" align="center" label="企业联系人" show-overflow-tooltip></el-table-column>
          <el-table-column prop="telephone" align="center" label="联系电话" show-overflow-tooltip></el-table-column>
          <el-table-column prop="directorUserName" align="center" label="负责人" show-overflow-tooltip></el-table-column>
          <el-table-column prop="createUserName" align="center" label="创建人" show-overflow-tooltip></el-table-column>
          <el-table-column prop="updateTime" align="center" label="上次修改日期" width="120"></el-table-column>
          <el-table-column label="操作" align="center" fixed="right" width="100">
            <template slot-scope="scope">
              <el-button type="text" @click="handleInfo(scope.row)">详情</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { Administration } from '@/api/projectAdministration.js';
import ContractsDetail from './ContractsDetail.vue';
export default {
  name: 'Contracts',
  data () {
    return {
      tableDate: [],
      isShowloading: false
    }
  },
  created () {
  },
  mounted () {
    this.loadDetailWidgetData()
  },
  methods: {
    /**
     * 项目合同
     */
    loadDetailWidgetData () {
      let params = {
        projectId: this.$route.query.projectId
      };
      return new Promise((resolve, reject) => {
        Administration.viewContract(this, params).then(res => {
          this.tableDate = []
          if (res.data) {
            this.tableDate.push(res.data)
          }
        }).catch(e => {
          reject(e);
        });
      });
    },
    // 查看
    handleInfo (row) {
      let params = {};
      this.$dialog.show('详情', ContractsDetail, {
        area: '800px'
      }, params).then(res => {
        this.loadDetailWidgetData()
      }).catch(e => {});
    }
  }
}
</script>
